<template>
<el-form :model="trip" ref="trip" label-width="92px">
    <el-form-item v-if="idVisible" label="序号" prop="id" readonly>
        <el-input v-model="trip.id" autocomplete="off"></el-input>
    </el-form-item>
    <el-form-item label="关键内容" prop="title">
        <el-input v-model="trip.title" autocomplete="off"></el-input>
    </el-form-item>
    <el-form-item label="时间" prop="start">
        <el-date-picker v-model="trip.timeInterval" type="daterange" align="right" unlink-panels range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions2" value-format="yyyy-MM-dd">
        </el-date-picker>
    </el-form-item>
    <el-form-item label="地区" prop="area">
        <el-input v-model="trip.area" autocomplete="off"></el-input>
    </el-form-item>
    <el-form-item label="备注" prop="remark">
        <el-input v-model="trip.remark" autocomplete="off"></el-input>
    </el-form-item>
</el-form>
</template>

<script>
export default {
    data() {
        return {
            name: 'trip-model',
            visual: true,
            idVisible: false,
            trip: {
                id: 0,
                title: "",
                timeInterval: 0,
                area: "",
                remark: ""
            },
            pickerOptions2: {
                shortcuts: [{
                    text: '最近一周',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                        picker.$emit('pick', [start, end]);
                    }
                }, {
                    text: '最近一个月',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                        picker.$emit('pick', [start, end]);
                    }
                }, {
                    text: '最近三个月',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                        picker.$emit('pick', [start, end]);
                    }
                }]
            }
        };
    },
    props: [],
    methods: {
    }
};
</script>
